//获取元素  当按下添加按钮后，获取输入框的数据，将其传给后端，由PHP做插入数据库的操作
const addBtn=document.querySelector('#addBtn')
const inputName = document.querySelector('#inputName'),
      inputPrice = document.querySelector('#inputPrice'),  
      inputNum = document.querySelector('#inputNum'),
      successInfo=document.querySelector('#successInfo')
//当按下添加按钮后，获取输入框的数据，将其传给后端，由PHP做插入数据库的操作
addBtn.onclick=function() {
    //console.log("done") 绑定成功
    //获取输入框里的元素值value  来自于首页index
    const name=inputName.value,
          price=inputPrice.value,
          number=inputNum.value
        // console.log(name,price,number) 
         //把这个数据传给后端，让PHP插入数据库
          utils.fetch('./api/v1/shop/add.php',{name,price,number}).then((res)=>{
              console.log(res)
              //表格自动刷新
              getShopList()
              successInfo.innerHTML=res.body.msg
              if(res.code===200){
                  successInfo.className="text-center text-primary"
              //这里希望添加后，在模态框显示一个成功信息，然后2s后自动隐藏
              //两秒后自动消失
              setTimeout(() => {
                $('#btn-add').modal('hide')
              }, 2000);
            }else{
               //让字体变色 表明失败
               successInfo.className="text-center text-danger"
            }
          }
          )
}
//再下一次打开的时候希望清空上一次输入的，有一个在模态框隐藏后自动调用的方法
$('#btn-add').on('hidden.bs.modal', function (e) {
    //上次成功信息清空
    successInfo.innerHTML=''
    // 把输入框中的内容清空,
    inputName.value=inputNum.value=inputPrice.value=''
    //还希望在添加数据成功后，table自动刷新加载最新数据，而不用手动刷新整个页面
    //因为在select方法里，有加载方法，故考虑封装成函数，在这里调用
   
  })